"""
@author: Gaoyaoxia
@date: 2021-03-12 15:40:34
"""
<!-- 我的提案 -->
<template>
  <div class="base-table-box">
    <div class="table-select-group">
      <div class="left">
        <s-select
          :selectOption="strSIds"
          v-model="params.strSId"
          style="width: 140px"
        />
        <s-select
          :selectOption="proposal.searchType2"
          v-model="params.type"
          style="width: 102px"
        ></s-select>
        <a-input
          class="search-input"
          v-model="params.search"
          placeholder="请输入搜索内容"
        />
        <a-button style="margin-left: 16px" type="primary" @click="search"
          >查询</a-button
        >
        <a-button @click="reset" class="btn-reset">重置</a-button>
      </div>

      <div class="right">
        <a-button type="primary" @click="add">新增</a-button>
      </div>
    </div>
    <a-table
      :pagination="pagination"
      :columns="columns"
      :data-source="tableData"
      :loading="loading"
      :scroll="{ x: '100%', y: '100%' }"
    >
      <template slot="caseName" slot-scope="text, record">
        <router-link
          class="link-a"
          :to="{
            path: '/cppccproposal/proposaldetail',
            query: { id: record.id }
          }"
          target="_blank"
          >{{ text }}</router-link
        >
      </template>
      <span slot="action" slot-scope="text, record">
        <div v-if="record.caseStatus == '暂存'">
          <router-link :to="'list/update'">修改</router-link>
          <a @click="onDelete(record)" class="btn-space">删除</a>
        </div>
        <div v-else>
          <a @click="toJointlyInfo(record)">联名信息</a>
        </div>
      </span>
    </a-table>
    <!-- 联名信息弹窗 -->
    <a-modal
      :visible="visible"
      title="联名信息"
      width="780px"
      @cancel="visible = false"
      :footer="null"
    >
      <div class="base-table-box">
        <a-table
          style="height: 525px"
          :pagination="pagination"
          :columns="modalColumns"
          :data-source="modalData"
        >
        </a-table>
      </div>
    </a-modal>
  </div>
</template>

<script>
import paging from 'mixins/paging'
import { proposal } from 'assets/js/select-option-list'
const columns = [
  {
    title: '序号',
    dataIndex: 'key',
    width: 80
  },
  {
    title: '流水号',
    dataIndex: 'serialNum',
    width: 110
  },
  {
    title: '案号',
    dataIndex: 'caseNo',
    width: 110,
    sorter: (a, b) => a.name.length - b.name.length
  },
  {
    title: '题目',
    dataIndex: 'caseName',
    width: 280,
    ellipsis: true,
    scopedSlots: { customRender: 'caseName' }
  },
  {
    title: '提案类别',
    dataIndex: 'caseType',
    width: 140
  },
  {
    title: '提交时间',
    dataIndex: 'pubDate',
    width: 200,
    sorter: (a, b) => a.name.length - b.name.length
  },
  {
    title: '提案状态',
    dataIndex: 'caseStatus',
    width: 140,
    sorter: (a, b) => a.name.length - b.name.length
  },
  {
    title: '办理状态',
    dataIndex: 'handleStatus',
    width: 140,
    sorter: (a, b) => a.name.length - b.name.length
  },
  {
    title: '操作',
    dataIndex: 'action',
    width: 140,
    scopedSlots: { customRender: 'action' }
  }
]
const modalColumns = [
  {
    title: '序号',
    dataIndex: 'key',
    align: 'center',
    width: 80
  },
  {
    title: '联名人',
    dataIndex: 'jointlyName',
    align: 'center',
    width: 120
  },
  {
    title: '状态',
    dataIndex: 'status',
    width: 100,
    align: 'center'
  },
  {
    title: '联名内容',
    dataIndex: 'content',
    width: 200
  },
  {
    title: '回复方式',
    dataIndex: 'replyWay',
    width: 100
  }
]
export default {
  mixins: [paging],
  components: {},
  data() {
    return {
      columns,
      modalColumns,
      proposal,
      //弹窗
      visible: false,
      //查询
      strSIds: [],
      params: {
        strSId: '十四届四次',
        type: ''
      },
      //table
      tableData: [],
      loading: false,
      modalData: []
    }
  },
  computed: {},
  watch: {},
  mounted() {},
  methods: {
    //获取列表数据
    getTableData() {
      this.tableData = [
        {
          key: 1,
          serialNum: '0013',
          caseNo: '0012',
          caseName: '春运来了,湖南铁路织密疫情防控网1',
          caseType: '',
          pubDate: '2021-03-11 16:11',
          caseStatus: '已立案',
          handleStatus: '办理中'
        },
        {
          key: 2,
          serialNum: '0007',
          caseNo: '0008',
          caseName: '关于后疫情期建立智慧教育云平台，共享优',
          caseType: '',
          pubDate: '2021-03-03 16:11',
          caseStatus: '已立案',
          handleStatus: '办理中'
        },
        {
          key: 3,
          serialNum: '',
          caseNo: '',
          caseName: '加快村医队伍建设',
          caseType: '',
          pubDate: '2021-03-11 16:11',
          caseStatus: '暂存',
          handleStatus: ''
        }
      ]
      this.pagination.total = 200
    },
    //查询
    search() {},
    //新增
    add() {
      this.$router.push('list/add')
    },
    //删除
    onDelete(record) {
      console.log(record)
      this.$confirm({
        title: '您是否确认要操作所选中的记录？',
        onOk() {
          //请求删除接口
        },
        onCancel() {}
      })
    },
    //联名信息
    toJointlyInfo() {
      this.visible = true
      this.modalData = [
        {
          key: 1,
          jointlyName: '程翔',
          status: '待确认',
          content: '',
          replyWay: ''
        },
        {
          key: 2,
          jointlyName: '李四',
          status: '待确认',
          content: '',
          replyWay: ''
        },
        {
          key: 3,
          jointlyName: '张三',
          status: '待确认',
          content: '',
          replyWay: ''
        }
      ]
    },
    //重置
    reset() {
      this.params = {
        strSId: '十四届四次',
        type: ''
      }
    }
  },
  created() {}
}
</script>
<style lang='less' scoped>
</style>